<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>警告框</title>
		<link href="css/bootstrap.min.css" rel="stylesheet" />
	</head>
	<body>
		<!--
			通过此插件可以为警告信息添加点击并消失的功能。
			为关闭按钮添加 data-dismiss="alert" 属性就可以使其自动为警告框赋予关闭功能。关闭警告框也就是将其从 DOM 中删除。
			为了让警告框在关闭时表现出动画效果，请确保为其添加了 .fade 和 .in 类。
		-->
		<div class="container">
            <div class="alert alert-info fade in" id="myalert">
            	<button type="button" class="close" data-dismiss="alert">&times;</button>
            	<strong>淘学网</strong>欢迎您的到来!
            	<button type="button" class="btn btn-primary">详情</button>
            </div>
            <div class="alert alert-info fade in" id="myalert1">
              <button type="button" class="close" data-dismiss="alert">&times;</button>
              <strong>淘学网</strong>欢迎您!
              <button type="button" class="btn btn-primary">详情</button>
            </div>
		</div>
		<script type="text/javascript" src="js/jquery.min.js" ></script>
		<script type="text/javascript" src="js/bootstrap.min.js" ></script>
		<script type="text/javascript">
			$("#myalert").alert("close");
			/**
			 * 两种触发事件:
			 * close.bs.alert  关闭时调用
			 * closed.bs.alert  关闭之后调用
			 */
			$('#myalert1').on('closed.bs.alert', function () {
               console.log("出发了");
               alert("haha");
           })
		</script>
	</body>
</html>
